﻿<template>
      <!--send box s-->
      <div class="wrap_letter_send_box">
        <p>
          <i>
            <img src="../../../static/img/layer_certain_ok_sign.png" alt="" class="layer_ok">
          </i>
          <span class="letter_title">
            发送成功
          </span>
        </p>
        <p>
          愿你们能成为更好
        </p>
         <p>
           的知己好友！
         </p>
         <div class="wrap_user_img">
           <img v-bind:src="send_user_img" alt="">
         </div>
         <!--<div class="finish_list" v-on:click="goTo_finish">-->
              <!--完善资料-->
         <!--</div>-->
        <!--
         <p class="next_title">
           接下来你可以
         </p>-->
        <!--<div class="layer_certain_btn_1"></div>-->
        <!--<div class="layer_certain_btn_1">跟深入的了解Ta</div>-->
        <!--<div class="layer_certain_btn_2"></div>
        <div class="layer_certain_btn_3"></div>-->
      </div>
</template>
<script>
  import { mapState, mapMutations, mapActions, mapGetters } from 'vuex';
  import "../../../static/css/Letter/Certain_layer.css";
  import { Toast } from 'mint-ui';
export default {
  name: 'hello',
  data () {
    return {
      get_layer_show: this.$store.getters.get_layer_show,
      send_user_img:""
    }
  },
  ...mapActions([
    "thom_redirect",
  ]),
  ...mapMutations([
    "Change_certain_layer"
  ]),
  mounted: function(){
    this.$emit("hide_load")
    this.send_user_img = this.get_user_letter();
  },
  methods: {
    ...mapGetters([
      "get_user_letter"
    ]),
    //页面跳转
    certain_jump: function () {
      this.$store.dispatch("thom_redirect",{name:"/letter/SucLetter",router:this.$router});
    },
    hid_layer:function () {
      this.$store.dispatch("thom_redirect",
        {
          name:"/Index_main",router:this.$router
        });
    },
    goTo_finish: function () {
      this.$store.dispatch("thom_redirect",
        {
          name: "/Wrap_login", router: this.$router
        });
    }
  }
}
</script>
<style scoped>
  .wrap_letter_send_box {
    height: 110vw;
    width: 78%;
  }
  .index_main .letter_send_box {
    background-color: #9f5c2f;
    width: 80vw;
    height: 120vw;
  }
  .finish_list {
    width: 36%;
    letter-spacing: 1px;
    margin: 10vw auto 0;
    background-color: rgb(78, 174, 77);
    color: #fff;
    border-radius: 2vw;
    box-shadow: 2px 3px 8px 2px rgba(14, 57, 14, 0.53);
    height: 2rem;
    line-height: 2rem;
    text-align: center;
    font-size: 0.7rem;
  }
  .wrap_letter_send_box {
    background-color: #9f5c2f;
    padding-top: 0;
    background-image: none;
    /*height: 18rem;*/
    height: 110vw;
    width: 78%;
  }
  .letter_send_box p:nth-child(1){
    margin-top:2rem;
  }
  .letter_send_box p:nth-child(2){
    margin-top:1rem;
  }
  .layer_certain_btn_1 {
    width: 60%;
    height: 2rem;
    line-height: 2rem;
    margin: 0 auto 0.1rem;
  }
  .layer_certain_btn_2 {
    width: 60%;
    height: 2rem;
    line-height: 2rem;
    margin: 0 auto 0.1rem;
  }
  .wrap_user_img {
    margin-bottom: 0.5rem;
    width: 31vw;
    height: 31vw;
    margin: 4vw auto;
  }
  .wrap_user_img img{
    width:30vw;
    height:30vw;
  }
  .letter_send_box p:nth-child(3) {
    margin-bottom: 0.5rem;
    margin-top:2vw;
  }
  .letter_send_box p:nth-child(2){
    margin-top:0.8rem;
  }
  .wrap_letter_send_box{
    line-height:1.4;
    color:#fff;
  }
</style>
